import {markRaw} from "vue"
import {BaseProperties, BaseEvents, BaseMethodList} from "../BaseVjsonComponent"
import defineVjsonComponent from "../../../runtime/DefineVjsonComponent"
import {Toolbar} from "../../Defaults"
import YvDesignToolbar from "./YvDesignToolbar.vue"
import YvVjsonToolbar from "./YvVjsonToolbar.vue"

export default defineVjsonComponent('toolbar', {
    defaults: Toolbar,
    designer: 'YvDesignToolbar',
    runtime: 'YvVjsonToolbar',
    install(Vue) {
        Vue.component('YvDesignToolbar', YvDesignToolbar)
        Vue.component('YvVjsonToolbar', YvVjsonToolbar)
    },
    Toolbox: [
        {category: 'advanced', order: 1, icon: 'icon-toolbar-'},
    ],
    properties: {
        ...BaseProperties,
        disabled: {order: 2, desc: '禁用', editor: 'switch', bindable: true, category: 'basic'},
        alignRight: {order: 3, desc: '靠右对齐', editor: 'switch', bindable: true, category: 'basic'},
        isFlat: {order: 4, desc: '平面按钮', editor: 'switch', bindable: true, category: 'other',},
        isFooterToolbar: {order: 5, desc: '底部工具条', editor: 'switch', bindable: true, category: 'other',},
        isCard: {order: 6, desc: '是否是卡片', editor: 'switch', bindable: true, category: 'other'},
        borderArr: {order: 7, desc: '边线', editor: 'border', bindable: true, category: 'other'},
    },
    events: {
        ...BaseEvents,
        click: {order: 1, desc: '点击后触发', category: 'basic'}
    },
    methodList: {
        ...BaseMethodList,
        performClick: {order: 1, desc: '点击后触发', category: 'basic'}
    }
})